// 用户页顶部组件
<template>
  <div class="header">
    <div class="content">
      <p>您好,欢迎您光临E智人力资源网站</p>
      <p @click="lose()" style="cursor: pointer">退出</p>
    </div>
  </div>
</template>

<script>
import { clearLoginInfo } from "@/utils";
export default {
  data() {
    return {};
  },
  methods: {
    lose() {
      this.$confirm(`确定进行[退出]操作?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$http({
            url: this.$http.adornUrl("/sys/logout"),
            method: "post",
            data: this.$http.adornData(),
          }).then(({ data }) => {
            if (data && data.code === 0) {
              clearLoginInfo();
              this.$router.push({ name: "login" });
            }
          });
        })
        .catch(() => {});
    },
  },
};
</script>

<style lang="scss">
.header {
  width: 100%;
  overflow: hidden;
  height: 45px;
  background-color: #fff;
  box-shadow: 0 2px 12px 0 #d3dce6;
  margin-top: 0px;
  .content {
    display: flex;
    width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
  }
}
</style>
